<template>
   <div class="resetpsw">
     <div class="content">
		<div class="areabox">
			<div class="public">
				<h3>重置密码</h3> 
				<ul>
					<li><b class="re_01"></b><input name="" v-model="loginName" type="text" placeholder="请输入邮箱或用户名"/></li>
					<li><b class="re_01"></b><input name="" v-model="mobile" type="text" placeholder="请输入手机号"/></li>
					<li><b class="re_02"></b><input name="" v-model="pwd" type="password" placeholder="请输入新密码"/></li>
					<li class="pecul"><b class="re_07"></b><input name="" v-model="smsCode" type="text" placeholder="请输入短信验证码"/>
            <a href="javascript:;" class="btn_org" v-if="!isgetSmsCode" @click="getSmsCode(mobile)">
              获取验证码
            </a>
            <a href="javascript:;" v-if="isgetSmsCode" class="btn_ashy">{{countDown}}秒后重发</a>
          </li>
				</ul>
				<a href="javascript:;" class="btn_org" @click="submit()">提交</a>
				<div class="extra">
				</div>
			</div>
		</div>
	</div>
	</div>
</template>
<script>
import commonJs from "@/common/js/common";
export default {
  name: "resetpsw",
  data() {
    return {
      mobile: "",
      loginName: "",
      pwd: "",
      isgetSmsCode: false,
      countDown: 60,
      smsCode: "",
      timer: null
    };
  },
  mounted() {},
  methods: {
    getSmsCode(mobile) {
      if (!this.mobile || !this.loginName) {
        this.$message({
          type: "warning",
          message: "你的验证码或邮箱填写有误！"
        });
        return;
      }
      this.isgetSmsCode = true;
      this.$http({
        method: "POST",
        url: commonJs.BASE_URL + "/smscode/verify.do",
        data: `mobile=${mobile}`
      })
        .then(res => {
          if (res.data.code == 0) {
            this.$message({
              type: "success",
              message: res.data.message
            });
            if (!this.timer) {
              this.timer = setInterval(() => {
                if (this.countDown > 0) {
                  this.isgetSmsCode = true;
                  this.countDown--;
                } else {
                  this.isgetSmsCode = false;
                  this.countDown = 60;
                  clearInterval(this.timer);
                  this.timer = null;
                }
              }, 1000);
            }
          } else {
            this.$message({
              type: "warning",
              message: res.data.message
            });
          }
        })
        .catch(error => {
          this.$message({
            message: " 网络错误，请稍后再试！",
            message: res.data.message
          });
        });
    },
    //提交
    submit() {
      if (!this.loginName || !this.mobile || !this.smsCode || !this.pwd) {
        this.$message({
          type: "warning",
          message: "信息填写有误！"
        });
        return;
      }
      this.$http({
        method: "POST",
        url: commonJs.BASE_URL + "/developer/reset_pwd.do",
        data: `loginName=${this.loginName}&mobile=${this.mobile}&smsCode=${
          this.smsCode
        }&pwd=${this.pwd}`
      })
        .then(res => {
          if (res.data.code == 0) {
            this.$message({
              type: "success",
              message: res.data.message
            });
            this.$router.push({ path: "/login", query: { type: 1 } });
          } else {
            this.$message({
              type: "warning",
              message: res.data.message
            });
          }
        })
        .catch(error => {
          this.$message({
            type: "warning",
            message: "网络错误，请稍后再试！"
          });
        });
    }
  }
};
</script>
<style>
.resetpsw {
  margin: 10% 0;
}
.code {
  background: lightgray;
  font-size: 25px;
  text-align: center;
  color: #fa8b00;
  cursor: pointer;
}
.codeTxt {
  color: red;
  position: relative;
  left: 340px;
  top: 25px;
}
</style>
